<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">
	<h:panelGroup layout="block" id="impresionWorkTable"
		rendered="#{cc.attributes.showWorkPanels}">
		<div class="row">
			<div class="col-md-12">
				<p:dataTable var="work" value="#{ordenProdMB.impPerformedWorks}"
					id="impWorkTable" editable="true" editMode="cell">
					<p:ajax event="rowEdit" listener="#{ordenProdMB.rowExtEdited}" />
					<p:ajax event="rowEditCancel" />
					<p:ajax event="cellEdit" listener="#{ordenProdMB.onImpCellEdit}" />
					<p:column headerText="Bob. N" id="impBoinaCol" style="width:25%">
						<p:cellEditor>
							<f:facet name="output">
								<h:outputText value="#{work.bobinaN}" />
							</f:facet>
							<f:facet name="input">
								<p:inputText value="#{work.bobinaN}" style="width:100%" />
							</f:facet>
						</p:cellEditor>
					</p:column>
					<p:column headerText="Mts." id="impMetrosCol" style="width:25%">
						<p:cellEditor>
							<f:facet name="output">
								<h:outputText value="#{work.meters}" />
							</f:facet>
							<f:facet name="input">
								<p:inputText value="#{work.meters}" style="width:100%" />
							</f:facet>
						</p:cellEditor>
					</p:column>
					<p:column headerText="Peso" style="width:25%" id="impPesoCol">
						<p:cellEditor>
							<f:facet name="output">
								<h:outputText value="#{work.peso}" />
							</f:facet>
							<f:facet name="input">
								<p:inputText value="#{work.peso}" style="width:100%" />
							</f:facet>
						</p:cellEditor>
					</p:column>
					<p:column headerText="Operario" style="width:43%" id="operarioCol">
						<p:cellEditor>
							<f:facet name="output">
								<h:outputText
									value="#{work.prodOperator != null ? work.prodOperator.firstname : ''} #{work.prodOperator != null ? work.prodOperator.lastname : ''} " />
							</f:facet>
							<f:facet name="input">
								<p:autoComplete value="#{ordenProdMB.selectedOperatorStr}"
									id="extOperatorAutocomplete"
									completeMethod="#{ordenProdMB.completeOperator}"
									forceSelection="true" styleClass="pull-left">
									<p:ajax event="itemSelect"
										listener="#{ordenProdMB.handleOperatorSelection}" />
								</p:autoComplete>
							</f:facet>
						</p:cellEditor>
					</p:column>

					<p:column style="width:6%">
						<p:rowEditor />
					</p:column>
					<p:column style="width:3%;">
						<p:commandLink styleClass="btn btn-small pull-right"
							action="#{ordenProdMB.deleteImpWork(work.id)}" process="@this"
							update="impWorkTable">
							<i class="glyphicon glyphicon-trash"></i>
						</p:commandLink>
					</p:column>
				</p:dataTable>
				<p:commandButton value="Agregar" style="margin-top: 10px;"
					actionListener="#{ordenProdMB.addImpresionWork}" process="@this"
					icon="ui-icon ui-icon-arrowthickstop-1-n" update="impWorkTable"></p:commandButton>
			</div>
		</div>
		<hr></hr>
		<div class="row">
			<div class="col-md-12">
				<h5 class="pull-left">SCRAP</h5>
				<p:commandLink styleClass="btn btn-small pull-left"
					actionListener="#{ordenProdMB.addImpresionScrap}" process="@this"
					style="margin-left:10px; margin-top: 0px;" update="impScrapPanelId">
					<span class="glyphicon glyphicon-save"></span>
				</p:commandLink>
			</div>
		</div>
		<h:panelGroup layout="block" id="impScrapPanelId" styleClass="row">
			<ui:repeat varStatus="status" var="scrap"
				value="#{ordenProdMB.impScrap}">
				<h:panelGroup layout="block" styleClass="col-md-4"
					rendered="#{status.index % 3 == 0 ? true : false}"
					style="margin-left:0px;  margin-bottom: 10px;
					 height:40px;">
					<div class="panel panel-default" style="height: 40px;">
						<div class="panel-body" style="height: 40px; padding-top: 5px;">
							<div class="row">
								<div class="col-md-3">
									<p:outputLabel value="Scrap" styleClass="pull-left">
									</p:outputLabel>
								</div>
								<div class="col-md-7">
									<p:inplace editor="true" emptyLabel="Editar"
										styleClass="pull-left">
										<p:inputText value="#{scrap.kg}" style="width:40px;"
											required="true"></p:inputText>
									</p:inplace>
								</div>
								<div class="col-md-2">
									<p:commandLink styleClass="btn btn-small pull-right"
										action="#{ordenProdMB.deleteImpresionScrap(scrap.id)}"
										process="@this">
										<span class="glyphicon glyphicon-trash"></span>
									</p:commandLink>
								</div>
							</div>
						</div>
					</div>
				</h:panelGroup>
				<h:panelGroup layout="block" styleClass="col-md-4"
					rendered="#{status.index % 3 != 0 ? true : false}"
					style="height:40px; margin-bottom: 10px;">
					<div class="panel panel-default" style="height: 40px;">
						<div class="panel-body" style="height: 40px; padding-top: 5px;">
							<div class="row">
								<div class="col-md-3">
									<p:outputLabel value="Scrap" styleClass="pull-left">
									</p:outputLabel>
								</div>
								<div class="col-md-7">
									<p:inplace editor="true" emptyLabel="Editar"
										styleClass="pull-left">
										<p:inputText value="#{scrap.kg}" style="width:40px;"
											required="true"></p:inputText>
									</p:inplace>
								</div>
								<div class="col-md-2">
									<p:commandLink styleClass="btn btn-small pull-right"
										action="#{ordenProdMB.deleteImpresionScrap(scrap.id)}"
										process="@this">
										<span class="glyphicon glyphicon-trash"></span>
									</p:commandLink>
								</div>
							</div>
						</div>
					</div>
				</h:panelGroup>
			</ui:repeat>
		</h:panelGroup>
		<hr></hr>
		<h:panelGroup id="impTotalHeader" layout="block">
			<div class="row">
				<div class="col-md-3">
					<p:outputLabel styleClass="pull-left">
						<strong>Total Bobinas:</strong>
					</p:outputLabel>
					<p:spacer width="10px"></p:spacer>
					<h:outputText value="#{ordenProdMB.impPerformedWorks.size()}"></h:outputText>
				</div>
				<div class="col-md-3">
					<p:outputLabel styleClass="pull-left">
						<strong>Total Metros:</strong>
					</p:outputLabel>
					<p:spacer width="10px"></p:spacer>
					<h:outputText value="#{ordenProdMB.selectedOp.impresions.totalMts}"></h:outputText>
				</div>
				<div class="col-md-3">
					<p:outputLabel styleClass="pull-left">
						<strong>Total Kg:</strong>
					</p:outputLabel>
					<p:spacer width="10px"></p:spacer>
					<h:outputText
						value="#{ordenProdMB.selectedOp.impresions.totalKilos}"></h:outputText>
				</div>
				<div class="col-md-3">
					<p:outputLabel styleClass="pull-left">
						<strong>Total Scrap:</strong>
					</p:outputLabel>
					<p:spacer width="10px"></p:spacer>
					<h:outputText
						value="#{ordenProdMB.selectedOp.impresions.totalScrap}"></h:outputText>
				</div>
			</div>
			<hr></hr>
			<div style="margin-bottom: 10px; margin-top: 10px;" class="row">
				<div class="col-md-2 pull-right">
					<p:commandButton value="Guardar" styleClass="pull-right"
						actionListener="#{ordenProdMB.saveImpresionWork}" process="@this"
						update="impresionWorkTable impTotalHeader"></p:commandButton>
				</div>
				<div class="col-md-3 pull-right">
					<p:commandButton value="Finalizar Impresion"
						disabled="#{cc.attributes.ordenProd.impresions.finalizationDate != null}"
						styleClass="pull-right"
						actionListener="#{ordenProdMB.impresionDone}" process="@this"
						update="impresionWorkTable impTotalHeader"></p:commandButton>
				</div>
			</div>
		</h:panelGroup>
	</h:panelGroup>
</ui:composition>